<!DOCTYPE html>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
  <head>
    <script src="/ajax/libs/smoothie/smoothie.js" type="text/javascript" ></script>
	<script src="/ajax/libs/smoothie/server-load.js" type="text/javascript" ></script>
	<style type="text/css">
		body {
			background-color: #000000;
			color: #eeeeee;
			font-family: tahoma, arial, sans-serif;
		}
		
		div.smoothie-chart-tooltip {
			background: #444;
			padding: 1em;
			margin-top: 20px;
			font-family: Consolas, monospace;
			color: white;
			font-size: 10px;
			pointer-events: none;
		}
	</style>

</head>
<body onload="init()">

	<h4>host1.example.com</h4>
	<canvas id="host1Cpu" width="500" height="100"></canvas>

	<h4>host2.example.com</h4>
	<canvas id="host2Cpu" width="500" height="100"></canvas>

	<h4>host3.example.com</h4>
	<canvas id="host3Cpu" width="500" height="100"></canvas>

	<h4>host4.example.com</h4>
	<canvas id="host4Cpu" width="500" height="100"></canvas>

	<em>This is fake data.</em>
</body>
</html>
